page {
  background-color: #eeeeee;
  position: relative;
}
 .searchInput_container {
  width: 100%;
  height: 300rpx;
  padding: 20rpx 20rpx;
  background-color: #cc9756;
}

.pageContent {
  padding: 20rpx 20rpx;
  position: absolute;
  left: 0;
  top: 70rpx;
}

.swiper_container {
  width: 100%;
  height: 300rpx;
  margin-top: 20rpx;
  .swiper_item {
    width: 100%;
    height: 100%;
      .swiper-image {
        width: 100%;
      }
  }
}

.channel_container {
  width: 100%;
  height: 120rpx;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background-color: #fff;
  border-radius: 20rpx;
  margin-top: 20rpx;

  .channel_item {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 24rpx;
    .iconfont {
      font-size: 50rpx;
    }
  }
}

.brand_container {
  width: 100%;
  background-color: #fff;
  padding: 0 10rpx;
  margin-top: 20rpx;
  border-radius: 20rpx;
  .brand_title {
    width: 100%;
    height: 120rpx;
    text-align: center;
    line-height: 120rpx;
    font-size: 34rpx;
  }
  .brand_list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    .brand_item {
      width: 50%;
      position: relative;
      &:nth-child(even) {
        padding-left: 5rpx;
      }
      &:nth-child(odd) {
        padding-right: 5rpx;
      }
      .brand_item_text {
        position: absolute;
        left: 20rpx;
        top: 20rpx;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        .brand_item_textName {
          font-weight: 600;
        }
        .brand_item_textPrice {
          font-size: 22rpx;
          color: #666;
        }
      }
      .brand_item_img {
        border-radius: 20rpx;
        width: 100%;
      }
    }
  }
}

.newGoods_container {
  width: 100%;
  padding: 0 10rpx 20rpx 10rpx;
  background-color: #fff;
  margin-top: 20rpx;
  border-radius: 20rpx;
  .newGoods_title {
    width: 100%;
    height: 120rpx;
    text-align: center;
    line-height: 120rpx;
    font-size: 34rpx;
  }
  .newGoods_list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    .newGoods_item {
      width: 50%;
      padding: 0 10rpx;
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      align-items: center;
      .newGoods_item_img {
        width: 100%;
        border-radius: 20rpx;
        background-color: #f4f4f4;
      }
      .newGoods_item_text {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        .newGoods_item_textPrice {
          color: #ff0000;
        }
      }
    }
  }
}

.hotGoods_container {
  width: 100%;
  padding: 0 10rpx;
  background-color: #fff;
  margin-top: 20rpx;
  border-radius: 20rpx;
  .hotGoods_title {
    width: 100%;
    height: 120rpx;
    text-align: center;
    line-height: 120rpx;
    font-size: 34rpx;
    border-bottom: 1rpx solid #ccc;
  }
  .hotGoods_list {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    .hotGoods_item {
      width: 100%;
      display: flex;
      justify-content: space-around;
      align-items: center;
      border-bottom: 1rpx solid #ccc;
      &:nth-child(3) {
        border: none;
      }
      .hotGoods_item_img {
        flex: 3;
        width: 100%;
      }
      .hotGoods_item_text {
        flex: 5;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        .hotGoods_item_textName {
          font-weight: 600;
        }
        .hotGoods_item_textBrief {
          margin-top: 20rpx;
          font-size: 22rpx;
          color: #666;
        }
        .hotGoods_item_textPrice {
          margin-top: 20rpx;
          color: #ff0000;
        }
      }
    }
  }
}

.topic_container {
  width: 100%;
  padding: 0 10rpx;
  background-color: #fff;
  margin-top: 20rpx;
  border-radius: 20rpx;
  .topic_title {
    width: 100%;
    height: 120rpx;
    text-align: center;
    line-height: 120rpx;
    font-size: 34rpx;
  }
  .topic_swiper_container {
    width: 100%;
    height: 500rpx;
    .topic_item {
      width: 100%;
      .topic_item_content {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        .topic_image {
          width: 100%;
          height: 360rpx;
        }
        .topic_text {
          width: 500rpx;
          padding: 20rpx 10rpx;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: flex-start;
          .topic_text_info {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            .topic_text_title {
              font-weight: 600;
            }
            .topic_text_price {
              margin-left: 20rpx;
              color: #ff0000;
            }
          }
          .topic_text_subtitle {
            font-size: 22rpx;
            color: #666;
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
          }
        }
      }
    }
  }
}

.category_container {
    width: 100%;
    padding: 0 10rpx 20rpx 10rpx;
    background-color: #fff;
    margin-top: 20rpx;
    border-radius: 20rpx;
  .category_list_container {
    .category_title {
      width: 100%;
      height: 120rpx;
      text-align: center;
      line-height: 120rpx;
      font-size: 34rpx;
    }
    .category_content{
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
      align-content: center;
      .category_item {
        width: 50%;
        padding: 0 10rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        .category_img {
          width: 100%;
          border-radius: 20rpx;
          background-color: #f4f4f4;
        }
        .category_text {
          padding: 20rpx 0;
          width: 100%;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          text-align: center;
          .category_text_name {
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
          }
          .category_text_price {
            color: #ff0000;
          }
        }
      }
    }
  }
}

